<html>
<head>
	<title>TEST OF WATAJAX</title>
	<script type="text/javascript" src="../jquery-1.3.2.min.js"></script>
	<script type="text/javascript" src="../jquery.watajax.js"></script>
	<link href="../css/beutiful/watajax.css" class="watajax_style" rel="stylesheet" type="text/css" />
        <link href="example.css" rel="stylesheet" type="text/css" />
        <style type="text/css">
            tr.green td {
                color: white;
                background-color: #006600;
            }
            tr.green td a {
                color: white;
            }
        </style>
</head>
<body>
        <?php include("menu.inc.php"); ?>
    
	<div id="test"></div>

        <div class="controls">
            <input type="button" value="Load SQL data" onClick="doSqlDataWatajax();" />
            <input type="button" onClick="doArrayDataWatajax();" value="Load Array data" />
            <input type="button" value="Change number of items per page to 50" onClick="changePerPage(50)" />
            <input type="button" value="Change number of items per page to 10" onClick="changePerPage(10)" />
            <input type="button" onClick="refreshTable(true);" value="Refresh whole table" />
            <input type="button" onClick="refreshTable(false);" value="Refresh table body" />
            <input type="button" onClick="clearSavedSettings();" value="Clear saved settings" />
            <select id="css_switcher">
                <option value="">Change style..</option>
                <option value="default">Default</option>
                <option value="beutiful">Beutiful</option>
                <option value="fitsin">Fits-in</option>
            </select>
        </div>
        <script type="text/javascript">
		var table = null;
		var eng = {
                       could_not_load_settings : "Kunde inte ladda WATAJAX",
                       all: "All",
                       rows: "rows",
                       page: "Page",
                       search: "Find",
                       no_rows_found: "Cant find any rows matching that criteria",
                       export_csv: "Export as file",
                       more_rows: "More rows.."
                }

		$("#test").watajax({ per_page: 10, table_id: 'watajax', tools_position: "above", ajax_connector: "ajax.php", lang: eng, enable_export: true, jump_on_pagechange: "table_top" });
		table = $("#test").data('watajax');
		
                $("#css_switcher").change(function() {
                    if($(this).val() != "") {
                        $("link.watajax_style").attr("href", "../css/"+$(this).val()+"/watajax.css");
                    }
                })

		function doSqlDataWatajax() {
			table.changeConnector('ajax.php?group=1,2,3&');
		}
		
		function doArrayDataWatajax() {
			table.changeConnector('array.php');
		}

		function refreshTable(whole) {
			if (whole) {
				table.refresh();
			} else {
				table.refreshTableBody();
			}
		}
		
		function changePerPage(num) {
			table.setPerPage(num);
		}

                function clearSavedSettings() {
                    table.clearSettings();
                    alert("Clear - now refresh page");
                }
	</script>
</body>
</html>